<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="author" content="董书华" />
    <title>工资计算器</title>
    <link rel="stylesheet" href="css/calc.css">
</head>

<body>
    <header>
        工资计算器
    </header>
    <main>
        <form>
            <!--required,必须输入，不能为空-->
            <input type="text" id="jbgz" placeholder="您的基本工资/社保基数" required="required">
            <input type="
            text" id="jxgz" value=""
            placeholder="您的绩效工资/计税" required>
            <input type="text" id="jj" placeholder="您的资金/计税" required>
            <input type="submit" id="submit" value="开始计算" required>
        </form>
        <section id="result">
            <dl>
                <dt>工资总额：</dt>
                <dd id="gzze">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <hr>
            <dl class="color">
                <dt>养老 8%</dt>
                <dd id="yl">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>医疗 2%</dt>
                <dd id="yiliao">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>失业 0.5%</dt>
                <dd id="sy">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>工伤 0%</dt>
                <dd id="gs">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>生育 0%</dt>
                <dd id="shengyu">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>公积金 8%</dt>
                <dd id="gjj">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>社保统筹</dt>
                <dd id="sbtc">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <hr>
            <dl>
                <dt>计税工资</dt>
                <dd id="jsgz">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <dl class="color">
                <dt>个人所得税</dt>
                <dd id="grsds">8000</dd>
                <dd class="clear"></dd>
            </dl>
            <hr>
            <dl>
                <dt>实发工资</dt>
                <dd id="sfgz">8000</dd>
                <dd class="clear"></dd>
            </dl>
        </section>
    </main>
    <script src="js/calc.js"></script>
</body>

</html>